<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8" />
    <title>智慧社区-物业管理</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/assets/img/favicon.png" type="image/x-icon">

    <!--Basic Styles-->
    <link href="${pageContext.request.contextPath}/resource/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/font-awesome.min.css" rel="stylesheet" />

    <!--Beyond styles-->
    <link href="${pageContext.request.contextPath}/resource/assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/animate.min.css" rel="stylesheet" />
<script src="${pageContext.request.contextPath}/resource/assets/js/skins.min.js"></script>
</head>
<body>
<%@include file="../header.jsp" %>
	<!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <%@include file="../nav.jsp" %><!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb" style="margin-top: 8px;">
                        <li>
                            <i class="fa fa-home"></i>
                            <a href="#">首页</a>
                        </li>
                        <li><a href="#">费用管理</a></li>
                        <li class="active">物业费设置</li>
                    </ul>
                </div><!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title" style="margin-top: 2px;">
                        <h1>
                           物业费设置
                        </h1>
                    </div><!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div><!--Header Buttons End-->
                </div><!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                	<div class="row">
	                	<div class="col-lg-6 col-sm-6 col-xs-12">
	                		<div class="widget">
                                        <div class="widget-header bordered-bottom bordered-palegreen">
                                            <span class="widget-caption">物业费相关设置</span>
                                        </div>
                                        <div class="widget-body">
                                           <div id="registration-form">
                                                        <form role="form">
                                                            <div class="form-title">
                                                            	物业费用设置
                                                            </div>
                                                            	<div class="form-group">
                                                                        <span class="input-icon icon-right">
                                                                            <input type="text" class="form-control" placeholder="所属小区" value="${loginUser.loginVillage.name}" disabled>
                                                                            <i class="glyphicon glyphicon-globe circular"></i>
                                                                       </span>
                                                              	</div>
                                                            <div class="form-group">
	                                                             <span class="input-icon icon-right">
		                                                                    <input id="price" type="text" class="form-control"  placeholder="物业费(单位：元/平米)" value="${fee.price}">
		                                                                    <i class="glyphicon glyphicon-user circular"></i>
		                                                                </span>
                                                                
                                                            </div>
                                                            
                                                             <div class="form-group">
	                                                             <span class="input-icon icon-right">
		                                                                    <input id="period" type="text" class="form-control"  placeholder="缴费周期（单位：个月）" value="${fee.period}">
		                                                                    <i class="glyphicon glyphicon-user circular"></i>
		                                                                </span>
                                                                
                                                            </div>
                                                            
                                                            <div class="form-group" id="reset">
                                                                <div class="checkbox">
				                                                        <label>
				                                                            <input type="checkbox" class="colored-blue" id="cbEnable" onclick="cbOnCheck(this)">
				                                                            <span class="text">重置物业费</span>
				                                                        </label>
				                                                    </div>
                                                            </div>
                                                            
                                                            <div class="form-title">
                                                               缴费优惠活动设置
                                                            </div>
                                                          
                                                                  <div class="form-group">
									                                            <div class="controls">
									                                                <div class="input-group">
									                                                    <input type="text" class="form-control" id="activeSpan" placeholder="活动时间段" />
									                                                    <span class="input-group-addon">
									                                                        <i class="fa fa-calendar"></i>
									                                                    </span>
									                                                </div>
									                                            </div>
                                                            </div>
                                                            <div class="form-group">
									                                            <div class="controls">
									                                                <div class="input-group">
									                                                    <input type="text" class="form-control" id="paySpan" placeholder="缴费时间段" />
									                                                    <span class="input-group-addon">
									                                                        <i class="fa fa-calendar"></i>
									                                                    </span>
									                                                </div>
									                                            </div>
                                                            </div>  
                                                            
                                                            <div class="form-group">
                                                                <span class="input-icon icon-right">
                                                                    <input type="text" class="form-control" id="discount" placeholder="折扣率(请填写小数，比如八折则填写0.8)" value="${discount.discount }">
                                                                    <i class="fa fa-credit-card"></i>
                                                                </span>
                                                            </div>
                                                            
                                                            <hr class="wide" />
                                                            <div class="row" style="text-align: right;margin-right: 10px;">
                                                            	<button type="button" class="btn btn-warning" onclick="cancel()"> 取 消 </button>
                                                            	<button type="button" class="btn btn-blue" onclick="save()"> 设 置 </button>
                                                            </div>
                                                            
                                                        </form>
                                                    </div> 
                                        </div>
                                    </div>
	                	</div>
                	
                    </div>
                </div><!-- /Page Body -->
             </div><!-- /Page Content -->
     	</div><!-- /Page Container -->
     </div><!-- /Main Container -->
     	<script src="${pageContext.request.contextPath}/resource/assets/js/jquery-2.0.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/assets/js/datetime/moment.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/datetime/daterangepicker.js"></script>
    <!--Beyond Scripts-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/beyond.min.js"></script>
    <script type="text/javascript">
    	$('.loading-container').hide();
    	$('#menu_fee').addClass("active open");
    	$('#menu_fee_setting').addClass("active");
    	
    	var feeSetting = "${fee}";
    	
    	
    	if (feeSetting != "") {
			$('#reset').show();
			$("#price").attr("disabled",true);
			$("#period").attr("disabled",true);
		}else {
			$("#reset").hide();
		}
    	
    	function cbOnCheck(obj){
        	if(obj.checked){
        		$('#price').attr('disabled',false);
        		$("#period").attr("disabled",false);
        	}else {
        		$("#price").attr("disabled",true);
        		$("#period").attr("disabled",true);
    		}
        }
    	
    	var activeStart = "${discount.beginAt}";
    	var activeEnd = "${discount.endAt}";
    	var payStart = "${discount.fromAt}";
    	var payEnd = "${discount.toAt}";
    	
    	$('#paySpan').daterangepicker({
    		}, function(startDate, endDate) {
    			payStart = startDate+"";
    			payEnd = endDate+"";
    		});
    	
    	$('#activeSpan').daterangepicker({
		}, function(startDate, endDate) {
			activeStart = startDate+"";
			activeEnd = endDate+"";
		});
    	
    	if (activeStart != "") {
    		var startAt = unixToDate(activeStart);
    		var endAt = unixToDate(activeEnd);
    		var date = startAt + " - " + endAt;
    		$('#activeSpan').val(date);
		}
    	
    	if (payStart != "") {
    		var startAt = unixToDate(payStart);
    		var endAt = unixToDate(payEnd);
    		var date = startAt + " - " + endAt;
    		$('#paySpan').val(date);
		} 
    	
    	function save(){
    		
    		var price = $("#price").val();
    		var period = $("#period").val();
    		var discount = $("#discount").val();
    		
    		if (price == "") {
				alert("请填写物业费单价！");
				return;
			}
    		
    		if (period == "") {
				alert("请填写缴费周期！");
				return;
			}
    		
    		if (discount != "") {
    			var validation = /^0\.[1-9]\d*$/;
    			var result = validation.test(discount);
    			if (!result) {
					alert("折扣率请填写小数！");
					return;
				}
			}
    	
    		$('.loading-container').show();
    		$.ajax({
    			"url":"${pageContext.request.contextPath}/fee_save",
    			"data":{price:price,period:period,beginAt:activeStart,endAt:activeEnd,fromAt:payStart,toAt:payEnd,discount:discount},
    			"type":'post',
    			"dataType":'json',
    			"success" : function(data) {
    				$('.loading-container').hide();
    				if (data == 200) {
    					alert("物业费相关设置已成功提交，客户端将按照缴费周期定期收到物业费账单。");
    				}else {
						alert("您的登录鉴权可能已过期，需要重新登录！");
					}
    			},
    			"error" : function(msg) {
    				alert("error msg:"+msg.responseText);
    			}
    		});
    	}
    	
    </script>
</body>
</html>